<style src="../../styles/index.css" scoped></style>
<style>
    .error{/*0审核失败*/
        color:#ed3f14;
    }
    .NotFillIn{/*1未填报*/
        color:#ff9900;
    }
    .FillIn{/*2已填报*/
        color:#993300;
    }
    .AlreadyReport{/*3已上报*/
        color:#2d8cf0;
    }
    .success{/*4审核通过*/
        color:#19be6b;
    }
    .lock{/*5锁定*/
        color:#80848f;
    }
</style>
<template>
<div class="IndexBox">
    <Row class="row">
         <Col :lg="{span:7}" :md="{span:12}" :sm="{span:24}" :xs="{span:24}"  style="display:none">
            <Card class="card" >
                <p slot="title">
                    <Icon type="android-contact" size=40  color="#239DCE"></Icon>&nbsp;&nbsp;&nbsp;&nbsp;
                    <label style="font-size:30px">欢迎您:{{UserModel.UserName}}</label>
                </p>
                <div class="CardContent"> 
                    <ul>
                        <li><span>上次登录:</span><span>{{UserModel.LastLoginTime|moment}}</span></li>
                        <li><span>所在地区:</span><span>{{UserModel.AreaCode|omgAreaName}}</span></li>
                        <li><span>个人电话:</span><span>{{UserModel.Phone}}</span></li>
                        <li><span>工作电话:</span><span>{{UserModel.TelPhone}}</span></li>
                        <li><span>电子邮件:</span><span>{{UserModel.Email}}</span></li>
                        <li><span>现任职务:</span><span>{{UserModel.PostName}}</span></li>
                        <li><span>工作单位:</span><span>{{UserModel.UnitName}}</span></li>
                        <li><span>单位地址:</span><span>{{UserModel.UnitAddress}}</span></li>
                        <li><span>特别提醒:</span><span><span style="color:red;">请核对个人信息，如需更改，请点击右上角。</span></span></li>                  
                    </ul>
                </div>
            </Card>
        </Col>
        <!--<Col :lg="{span:16,offset:1}" :md="{span:12}" :sm="{span:24}" :xs="{span:24}"  class="Col">-->
        <Col >
            <Card class="card" >
                <p slot="title">
                    <Icon type="clipboard" size=40 color="#239DCE"></Icon>&nbsp;&nbsp;&nbsp;&nbsp;
                    <label style="font-size:30px">进度概览</label> 
                </p>
                <div class="CardContent">
                    <Table :context="self" ref="table" :stripe=true :border=true :columns="TableHeader" :data="datas.model" size="large" height=400>
                    </Table>
                </div>       
            </Card>
        </Col>
    </Row>
</div>
</template>
<script>
 export default {
        name:'index', 
        data(){
            return {
                self:this,
                currentTime:'',
                CurrentYear: this.GetCurrentYear(),//当前年度
                userInfo: this.GetlocaStorage("VegUserInfo"),
                UserModel: {},
                clientHeight: window.innerHeight - 137,//表格默认高度
                datas:[],
                TableHeader: [{
                        title: '报表名称',
                        key: 'ReportName',
                        ellipsis: true
                    },
                    {
                        title: '重新填写',
                        key: 'ReviewFalse',
                        width:121,
                        className:'error'
                    },
                    {
                        title: '未填写',
                        key: 'NotFillIn',
                        width:121,
                        className:'NotFillIn'
                    },
                    {
                        title: '已填写',
                        key: 'FillIn',
                        width:121,
                        className:'FillIn'
                    },
                    {
                        title: '已上报',
                        key: 'AlredayReport',
                        width:121,
                        className:'AlreadyReport'
                    },
                    {
                        title: '审核通过',
                        key: 'ReviewSuccess',
                        width:121,
                        className:'success'
                    }
                ],
            }
        },
        methods:{
            initUser() {//初始化用户信息
                var self = this;
                this.$http.get("User", { params: { id: self.userInfo.UserId }}).then(
                    function (res) {
                        if (res.data.status == 1) {
                            self.UserModel = res.data.model;
                        }
                        else {
                            self.$Modal.error({ title: "提示信息", content: "系统异常，请与管理员联系!!!" });
                        }
                    });
            },
            initReportReview(){//初始化进度概况
                var self = this;
                self.CurrentYear=self.CurrentYear+"年";
                var user = self.GetlocaStorage("VegUserInfo");
                self.$http.get('Report/GetReportReview?AreaCode='+user.AreaCode+'&FillInYear='+self.CurrentYear).then(function(res) {
                    if (res.data.status === 1) {
                        self.datas = res.data;
                    } 
                    else {
                        self.$Modal.error({
                            title: '提示信息',
                            content: res.data.message
                        });
                    }
                });
            }
        },
        //创建Vue页面方法
        created: function () {
            this.initUser();//初始化用户信息
            this.initReportReview();//初始化待办事项
        },
        watch:{

        }
    }
</script>